<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title><%= __('titLe') %></title>
    <link href="image/favicon.ico" rel="shortcut icon">
    <link rel="stylesheet" href="//at.alicdn.com/t/font_607959_8t0w2txptnj.css">
    <link rel="stylesheet" href="css/base.css">
    <link rel="stylesheet" href="css/header.css">
    <link rel="stylesheet" href="css/announcement.css">
</head>
<body>
    <div class="announcement-box">
        <%- include('base/header'); %>
        <div class="announcement-header"><div><%= __('announcement') %></div></div>
        <div class="Announcementlist">
            <ul class="Announcementlist-ul">
                <% allannouncement.forEach((item,index) => { %>
                    <a href="/Details/<%= item.id %>">
                        <li>
                            <div class="title">
                                <span v-html="filtertime(<%= item.publishTime %>)"></span>
                                <div><%= item.title %></div>
                            </div>
                            <div class="announcement-body"><%- item.content %></div>
                        </li>
                    </a>
                <% }) %>
            </ul>
            <!-- <div class="pagebtn" v-if="false">
                    <ul class="pagination" >
                        <li v-show="Quantity != 1" @click="Quantity-- && gotoPromotion(Quantity)" ><a href="#">上一页</a></li>
                        <li v-for="index in lastPage1" @click="gotoPromotion(index)" :class="{'active':Quantity == index}" :key="index">
                            <a href="#" >{{index}}</a>
                        </li>
                        <li v-show="Pagenumber != Quantity && Pagenumber != 0 " @click="Quantity++ && gotoPromotion(Quantity++)"><a href="#" >下一页</a></li>
                    </ul>
             </div> -->
        </div>
        <%- include('base/footer'); %>
    </div>
    <script src="https://unpkg.com/axios/dist/axios.min.js"></script>
    <script src="https://cdn.jsdelivr.net/npm/vue@2.5.16/dist/vue.js"></script>
</body>
<script>
    var app1=new Vue({
        el:'.Announcementlist',
        data:{
            Pagenumber:12,
            Quantity:1,
            Afew:5
        },
        computed:{
            lastPage1:function(){
                var pag = [];
                  if( this.Quantity < this.Afew ){ //如果当前的激活的项 小于要显示的条数
                       //总页数和要显示的条数那个大就显示多少条
                       var i = Math.min(this.Afew,this.Pagenumber);
                       while(i){
                           pag.unshift(i--);
                       }
                   }else{ //当前页数大于显示页数了
                       var middle = this.Quantity - Math.floor(this.Afew / 2 ),//从哪里开始
                           i = this.Afew;
                       if( middle >  (this.Pagenumber - this.Afew)  ){
                           middle = (this.Pagenumber - this.Afew) + 1
                       }
                       while(i--){
                           pag.push( middle++ );
                       }
                   }
                 return pag
               },
        },
        methods:{
            gotoPromotion(index){//推广分页跳转
                if(index == this.Quantity) 
                    return;
                this.Quantity = index;
            },
            filtertime(time){ 
                let times=new Date(time)
                let month=times.getMonth()+1
                let day=times.getDate()
                if(month<10){
                    month='0'+month
                }
                if(day<10){
                    day='0'+day
                }
                return  `${month}-${day}`
            }
        }
    })
</script>
</html>
